import { Tooltip } from 'antd';
import { forwardRef } from 'react';
import styles from './index.less';

const ContractChecked = forwardRef((props: any, ref: any) => {
  const { options = [], onChange, setOpen } = props;
  //选中
  const _groupChange = async (list: any[]) => {
    onChange(list);
    setOpen(false);
  };
  return (
    <div style={{ padding: '8px 0' }} ref={ref}>
      <div className={styles.group}>
        {options.map((t: any, i: number) => (
          <div
            className={styles.check_flex}
            key={i}
            onClick={(e) => {
              e.stopPropagation(), _groupChange([t.value]);
            }}
          >
            <div className={styles.group_box}>
              <div className={styles.cell}>
                <div className={styles.node_title}>
                  <Tooltip title={t.stationName}>{t.stationName}</Tooltip>
                </div>
                <div className={styles.node_flex}>
                  <div className={t.tradeRole === '1' ? styles.type_buy : styles.type_sale}>
                    {t.tradeRole === '1' ? '买入' : '卖出'}
                  </div>
                  <Tooltip title={t.label}>
                    <span className={styles.text}>{t.label}</span>
                  </Tooltip>
                </div>
              </div>
            </div>
          </div>
        ))}
      </div>
    </div>
  );
});
export default ContractChecked;
